<template>
  <div class="job">
    <h3>职位精选</h3>
    <job-list-customer :list="list" :finished.sync="finished" :loading.sync="loading" @toFetch="fetchData"/>
  </div>
</template>

<script>
import JobListCustomer from '@/components/job/job-list-customer'
import { getJobList } from '@/api/company'

export default {
  components: {
    JobListCustomer,
  },
  name: 'job',
  data () {
    return {
      sort: 1,
      pageNo: 1,
      total: 0,
      finished: false,
      loading: false,
      list: [],
    }
  },
  created () {
    this.fetchData()
  },
  methods: {
    fetchData () {
      getJobList({
        cityid: '',
        is_all: '',
        eid: '',
        posttypeid: '',
        attrid: '',
        industryid: '',
        keywords: '',
        sort: this.sort,
        page: this.pageNo++,
      }).then(res => {
        this.loading = false
        if (res.code === 200) {
          res.data && (this.total = res.data.count || 0)
          res.data && this.list.push(...res.data.data)
          if (this.list.length >= this.total) {
            this.finished = true
          }
        } else {
          this.finished = true
          this.$alertErr(res.msg)
        }
      }).catch(err => {
        this.finished = true
        this.loading = false
        this.$alertErr(err || '网络错误, 稍后再试！')
      })
    },
    jumpTo (obj) {
      if (!obj.id) {
        this.$alertWarn('未获取到ID，请刷新后再试！')
        return
      }
      let timers = setTimeout(() => {
        this.$router.push({
          path: 'job',
          query: {
            id: obj.id,
          },
        })
        clearTimeout(timers)
        timers = null
      }, 300)
    },
  },
}
</script>

<style lang="stylus" scoped>
.job
  padding-top 10px

  h3
    font-size 20px
    height 70px
    line-height 70px
    padding-left 20px

  .job-list
    height 100vh
    overflow auto

</style>
